import styles from "@styles/active/activeadd.module.less";

import React, { useEffect } from "react";
import { withRouter } from "react-router-dom";
import { Select, Form, DatePicker } from "antd";
import { layout, dateFormatTime, disabledDate } from "@actions/data";

const { RangePicker } = DatePicker;
const { Option } = Select;

function SignIn({ formSignIn }) {
  useEffect(() => {
    formSignIn.setFieldsValue({
      activityType: 4,
      signInType: "1",
      startDate: "",
      endDate: "",
    });

    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);

  const rangepickerChange1 = (value, valueStr) => {
    formSignIn.setFieldsValue({
      startDate: valueStr[0],
      endDate: valueStr[1],
    });
  };

  return (
    <Form {...layout} layout="vertical" form={formSignIn}>
      <hgroup>
        <h5>基本信息</h5>
        <aside className={styles.signupEssentialInformation}>
          <Form.Item
            name="rangepicker"
            label="活动时间"
            rules={[{ required: true, message: "请选择活动时间" }]}
          >
            <RangePicker
              showTime
              disabledDate={disabledDate}
              format={dateFormatTime}
              placeholder={["开始时间", "结束时间"]}
              onChange={rangepickerChange1}
            />
          </Form.Item>
          <Form.Item label="签到方式" name="signInType">
            <Select defaultValue="1" allowClear>
              <Option value="1">只能投一次</Option>
              <Option value="2">每日均可投</Option>
            </Select>
          </Form.Item>
        </aside>
      </hgroup>
    </Form>
  );
}

export default withRouter(SignIn);
